﻿{% extends "layout.html" %}
{% block content %}"}
<!-- Classes Section -->
<section class="who-we-section">
    <div class="container">
        <div class="row">
            <div class="col-sm-6 col-xs-12">
                <div class="who-we-img">
                    <img alt="" src="../static/images/about/who.jpg">
                </div>
            </div>
            <div class="col-sm-6 col-xs-12 text-left">
                <div class="who-we-details">
                    <h2 class="title-2">Who We Are</h2>
                    <p class="subtitle color">We Create Something New</p>
                    <article class="who-we-content">
                        <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
                            eiusmod tempor incididunt ut labore et dolore magna aliqua.
                            Ut enim ad minim veniam, quis nostrud exercitation ullamco
                            laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
                            dolor in reprehenderit in voluptate velit esse cillum dolore
                            eu fugiat nulla pariatur.
                        </p>
                        <p>
                            Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
                            officia deserunt mollit anim id est laborum. Sed ut perspiciatis
                            unde omnis iste natus error sit voluptatem accusantium doloremque.
                        </p>
                    </article>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- /.who-we-section -->
<!-- Promo Section -->
<section class="promo-section">
    <div class="container">
        <div class="row">
            <div class="col-sm-7 col-md-5 col-xs-12">
                <div class="promo-content">
                    <div class="promo-img">
                        <img src="../static/images/home1/logo2.png" alt="">
                    </div>
                    <h4>Kindergarten School</h4>
                    <p>
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit,
                        sed do eiusmod tempor incididunt ut labore et dolore magna
                        aliqua. Ut enim ad minim veniam, quis nostrud exercitation
                        ullamco laboris nisi ut aliquip.
                    </p>
                    <a href="#" class="primary-btn"><span>Enroll Your Child</span></a>
                </div>
            </div>
            <div class="col-sm-5 col-md-7">
                <div class="enroll-img">
                    <img alt="" src="../static/images/home1/enroll-img.png">
                </div>
            </div>
        </div>
    </div>
</section>
<!-- /.promo-section -->
<!-- Atmosphere Section -->
<section class="atmosphere-section">
    <div class="container">
        <div class="row">
            <div class="col-sm-7 col-xs-12">
                <div class="kids-mom-img">
                    <img alt="" src="../static/images/about/kids-mom.jpg">
                </div>
            </div>
            <div class="col-sm-5 col-xs-12">
                <div class="atmosphere-details">
                    <h2 class="title-2">Atmosphere</h2>
                    <p class="subtitle color">Quality Children</p>
                    <article class="atmosphere-content">
                        <p>
                            Lorem ipsum dolor sit amet, sed
                            do eiusmod tempor incididunt ut labore et dolore magna
                            aliqua. Ut enim ad minim veniam, quis nostrud exercitation.
                        </p>
                        <ul>
                            <li>
                                <i class="fa fa-check"></i>
                                <span>
                                    Consectetur adipisicing elit, sed do eiusmod
                                    tempor incididunt ut labore et dolore magna aliqua.
                                </span>
                            </li>
                            <li>
                                <i class="fa fa-check"></i>
                                <span>
                                    Ut enim ad minim veniam, quis nostrud exercitation.
                                </span>
                            </li>
                            <li>
                                <i class="fa fa-check"></i>
                                <span>
                                    Duis aute irure dolor in reprehenderit in voluptate
                                    velit esse cillum dolore eu fugiat nulla pariatur.
                                </span>
                            </li>
                        </ul>
                    </article>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- /.atmosphere-section -->
<!-- Welcome Section -->
<section class="activity-section">
    <div class="container">
        <div class="row">
            <div class="col-sm-12 col-xs-12 text-center">
                <h2 class="title-2">Our Activities</h2>
                <p class="subtitle color">Best Services for Kids</p>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="welcome-img">
                    <img alt="" src="../static/images/home1/about1.jpg">
                    <div class="welcome-content">
                        <div class="svg-overlay">
                            <svg version="1.1" id="circle" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 500 250" enable-background="new 0 0 500 250" xml:space="preserve" preserveAspectRatio="none"><path d="M250,246.5c-97.85,0-186.344-40.044-250-104.633V250h500V141.867C436.344,206.456,347.85,246.5,250,246.5z"></path></svg>
                        </div>
                        <i class="icon-reader"></i>
                        <h4>Active Learning</h4>
                        <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit,
                            sed do eiusmod tempor.
                        </p>
                    </div>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="welcome-img two">
                    <img alt="" src="../static/images/home1/about2.jpg">
                    <div class="welcome-content">
                        <div class="svg-overlay">
                            <svg version="1.1" id="circle" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 500 250" enable-background="new 0 0 500 250" xml:space="preserve" preserveAspectRatio="none"><path d="M250,246.5c-97.85,0-186.344-40.044-250-104.633V250h500V141.867C436.344,206.456,347.85,246.5,250,246.5z"></path></svg>
                        </div>
                        <i class="icon-music-class"></i>
                        <h4>Music Lessons</h4>
                        <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit,
                            sed do eiusmod tempor.
                        </p>
                    </div>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="welcome-img three">
                    <img alt="" src="../static/images/home1/about3.jpg">
                    <div class="welcome-content">
                        <div class="svg-overlay">
                            <svg version="1.1" id="circle" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 500 250" enable-background="new 0 0 500 250" xml:space="preserve" preserveAspectRatio="none"><path d="M250,246.5c-97.85,0-186.344-40.044-250-104.633V250h500V141.867C436.344,206.456,347.85,246.5,250,246.5z"></path></svg>
                        </div>
                        <i class="icon-teacher"></i>
                        <h4>Professional Teachers</h4>
                        <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit,
                            sed do eiusmod tempor.
                        </p>
                    </div>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="welcome-img four">
                    <img alt="" src="../static/images/home1/about4.jpg">
                    <div class="welcome-content">
                        <div class="svg-overlay">
                            <svg version="1.1" id="circle" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 500 250" enable-background="new 0 0 500 250" xml:space="preserve" preserveAspectRatio="none"><path d="M250,246.5c-97.85,0-186.344-40.044-250-104.633V250h500V141.867C436.344,206.456,347.85,246.5,250,246.5z"></path></svg>
                        </div>
                        <i class="icon-parents"></i>
                        <h4>Parents Day</h4>
                        <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit,
                            sed do eiusmod tempor.
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- /.activity-section -->
<!-- Team Section -->
<section class="team-section">
    <div class="container">
        <div class="row">
            <div class="col-sm-12 col-xs-12 text-center">
                <h2 class="title">Meet Our Staffs</h2>
                <p class="subtitle color">
                    Best Skilled Teacher
                </p>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="single-team">
                    <div class="team-img">
                        <img alt="" src="../static/images/about/staff1.jpg">
                        <ul class="team-social">
                            <li><a href="#" class="facebook"><i class="fa fa-facebook"></i></a></li>
                            <li><a href="#" class="twitter"><i class="fa fa-twitter"></i></a></li>
                            <li><a href="#" class="gplus"><i class="fa fa-google-plus"></i></a></li>
                            <li><a href="#" class="instagram"><i class="fa fa-instagram"></i></a></li>
                        </ul>
                    </div>
                    <h3>Ricardo Spencer</h3>
                    <p>Assistant Teacher</p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="single-team">
                    <div class="team-img">
                        <img alt="" src="../static/images/about/staff2.jpg">
                        <ul class="team-social">
                            <li><a href="#" class="facebook"><i class="fa fa-facebook"></i></a></li>
                            <li><a href="#" class="twitter"><i class="fa fa-twitter"></i></a></li>
                            <li><a href="#" class="gplus"><i class="fa fa-google-plus"></i></a></li>
                            <li><a href="#" class="instagram"><i class="fa fa-instagram"></i></a></li>
                        </ul>
                    </div>
                    <h3>Fanny Greer</h3>
                    <p>Assistant Teacher</p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="single-team">
                    <div class="team-img">
                        <img alt="" src="../static/images/about/staff3.jpg">
                        <ul class="team-social">
                            <li><a href="#" class="facebook"><i class="fa fa-facebook"></i></a></li>
                            <li><a href="#" class="twitter"><i class="fa fa-twitter"></i></a></li>
                            <li><a href="#" class="gplus"><i class="fa fa-google-plus"></i></a></li>
                            <li><a href="#" class="instagram"><i class="fa fa-instagram"></i></a></li>
                        </ul>
                    </div>
                    <h3>Albert Cole</h3>
                    <p>Assistant Teacher</p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="single-team">
                    <div class="team-img">
                        <img alt="" src="../static/images/about/staff4.jpg">
                        <ul class="team-social">
                            <li><a href="#" class="facebook"><i class="fa fa-facebook"></i></a></li>
                            <li><a href="#" class="twitter"><i class="fa fa-twitter"></i></a></li>
                            <li><a href="#" class="gplus"><i class="fa fa-google-plus"></i></a></li>
                            <li><a href="#" class="instagram"><i class="fa fa-instagram"></i></a></li>
                        </ul>
                    </div>
                    <h3>Rhoda Byrd</h3>
                    <p>Assistant Teacher</p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="single-team">
                    <div class="team-img">
                        <img alt="" src="../static/images/about/staff5.jpg">
                        <ul class="team-social">
                            <li><a href="#" class="facebook"><i class="fa fa-facebook"></i></a></li>
                            <li><a href="#" class="twitter"><i class="fa fa-twitter"></i></a></li>
                            <li><a href="#" class="gplus"><i class="fa fa-google-plus"></i></a></li>
                            <li><a href="#" class="instagram"><i class="fa fa-instagram"></i></a></li>
                        </ul>
                    </div>
                    <h3>Mike Campau</h3>
                    <p>Assistant Teacher</p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="single-team">
                    <div class="team-img">
                        <img alt="" src="../static/images/about/staff6.jpg">
                        <ul class="team-social">
                            <li><a href="#" class="facebook"><i class="fa fa-facebook"></i></a></li>
                            <li><a href="#" class="twitter"><i class="fa fa-twitter"></i></a></li>
                            <li><a href="#" class="gplus"><i class="fa fa-google-plus"></i></a></li>
                            <li><a href="#" class="instagram"><i class="fa fa-instagram"></i></a></li>
                        </ul>
                    </div>
                    <h3>Fernando Vicente</h3>
                    <p>Assistant Teacher</p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="single-team">
                    <div class="team-img">
                        <img alt="" src="../static/images/about/staff7.jpg">
                        <ul class="team-social">
                            <li><a href="#" class="facebook"><i class="fa fa-facebook"></i></a></li>
                            <li><a href="#" class="twitter"><i class="fa fa-twitter"></i></a></li>
                            <li><a href="#" class="gplus"><i class="fa fa-google-plus"></i></a></li>
                            <li><a href="#" class="instagram"><i class="fa fa-instagram"></i></a></li>
                        </ul>
                    </div>
                    <h3>Nick Liefhebber</h3>
                    <p>Assistant Teacher</p>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="single-team">
                    <div class="team-img">
                        <img alt="" src="../static/images/about/staff8.jpg">
                        <ul class="team-social">
                            <li><a href="#" class="facebook"><i class="fa fa-facebook"></i></a></li>
                            <li><a href="#" class="twitter"><i class="fa fa-twitter"></i></a></li>
                            <li><a href="#" class="gplus"><i class="fa fa-google-plus"></i></a></li>
                            <li><a href="#" class="instagram"><i class="fa fa-instagram"></i></a></li>
                        </ul>
                    </div>
                    <h3>Antonio Sortino</h3>
                    <p>Assistant Teacher</p>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12 col-xs-12 text-center">
                <div class="stuff-button">
                    <a class="primary-btn" href="#"><span>See all Staff</span></a>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- /.team-section -->
<!-- Testimonial Section -->
<section class="testimonial-section">
    <div class="container">
        <div class="row">
            <div class="col-sm-8 col-sm-offset-2 col-xs-12">
                <div id="testimonial-carousel" class="carousel slide" data-ride="carousel">
                    <!-- Indicators -->
                    <ol class="carousel-indicators">
                        <li data-target="#testimonial-carousel" data-slide-to="0" class="active"></li>
                        <li data-target="#testimonial-carousel" data-slide-to="1"></li>
                        <li data-target="#testimonial-carousel" data-slide-to="2"></li>
                    </ol>

                    <!-- Wrapper for slides -->
                    <div class="carousel-inner" role="listbox">
                        <div class="item active">
                            <div class="testimonials text-center">
                                <div class="testimonial-img">
                                    <img alt="" src="../static/images/home1/testi-person.jpg">
                                </div>
                                <div class="testimonial-details">
                                    <i class="icon-testimonial"></i>
                                    <h4>Jaklin Nowkin</h4>
                                    <span>Parents</span>
                                    <p>
                                        “ Lorem ipsum dolor sit amet, consectetur adipisicing elit,
                                        sed do eiusmod tempor incididunt ut labore et dolore magna
                                        aliqua. Ut enim ad minim veniam, quis nostrud.”
                                    </p>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="testimonials text-center">
                                <div class="testimonial-img">
                                    <img alt="" src="../static/images/home1/testi-person.jpg">
                                </div>
                                <div class="testimonial-details">
                                    <i class="icon-testimonial"></i>
                                    <h4>Jaklin Nowkin</h4>
                                    <span>Parents</span>
                                    <p>
                                        “ Lorem ipsum dolor sit amet, consectetur adipisicing elit,
                                        sed do eiusmod tempor incididunt ut labore et dolore magna
                                        aliqua. Ut enim ad minim veniam, quis nostrud.”
                                    </p>
                                </div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="testimonials text-center">
                                <div class="testimonial-img">
                                    <img alt="" src="../static/images/home1/testi-person.jpg">
                                </div>
                                <div class="testimonial-details">
                                    <i class="icon-testimonial"></i>
                                    <h4>Jaklin Nowkin</h4>
                                    <span>Parents</span>
                                    <p>
                                        “ Lorem ipsum dolor sit amet, consectetur adipisicing elit,
                                        sed do eiusmod tempor incididunt ut labore et dolore magna
                                        aliqua. Ut enim ad minim veniam, quis nostrud.”
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- /.testimonial-section -->
<!-- Address Section -->
<section class="address-section">
    <div class="container">
        <div class="row">
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="single-address">
                    <i class="icon-class"></i>
                    <h3>Class Sessions</h3>
                    <address>
                        <p>Sat - Fri (8 am – 2 pm)</p>
                        <p>Sun - Mon (8 am – 11 am)</p>
                    </address>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="single-address two">
                    <i class="icon-map"></i>
                    <h3>Kidzy Address</h3>
                    <address>
                        <p>123 White Amphitheatre Kinway,</p>
                        <p>Mountain, CA 12345, USA</p>
                    </address>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="single-address three">
                    <i class="icon-clock"></i>
                    <h3>Office Hours</h3>
                    <address>
                        <p>Monday – Friday</p>
                        <p>8.00 am – 5.00 pm</p>
                    </address>
                </div>
            </div>
            <div class="col-sm-6 col-md-3 col-xs-12 text-center">
                <div class="single-address four">
                    <i class="icon-call"></i>
                    <h3>Phone & E-mail</h3>
                    <address>
                        <p>+123 456 78910</p>
                        <p>enroll@kidzy.com</p>
                    </address>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- /.address-section -->
{% endblock %}